<template>
	<u-tabbar :value="tabValue" @change="changeTab" :zIndex="100" :border="false" :activeColor="tabValue===2?'#d81e06':'#2D8EF2'">
		<u-tabbar-item v-for="(item,index) in tabData" :text="item.name" :key="index"
		 :icon="item.inactiveIcon"></u-tabbar-item>
		<!-- 中间凸起按钮 -->
		<!-- <u-tabbar-item>
			<view slot="active-icon" class="tabMessage"><image class="tabImg" :src="imageBase+'wy-tab-xiaoxi.png'"/></view>
			<view slot="inactive-icon" class="tabMessage"><image class="tabImg" :src="imageBase+'wy-tab-xiaoxi.png'"/></view>
		</u-tabbar-item> -->
		<!-- 中间凸起按钮end -->
	
	</u-tabbar>
</template>

<script>
	export default {
		name: "cTabBar",
		props:{
			tabValue:Number, //默认选中项
		},
		data() {
			return {
				tabData: [
					{name:'首页',path:'pages_gridMember/index/index',activeIcon:'tab-sy-cur.png',inactiveIcon:'home'},
					{name:'消息',path:'pages_gridMember/chat/chat',activeIcon:'tab-im-cur.png',inactiveIcon:'photo'},
					{name:'党建',path:'pages_gridMember/partyBuilding/partyBuilding',activeIcon:'tab-dj-cur.png',inactiveIcon:'play-right'},
					{name:'我的',path:'pages_gridMember/user/user',activeIcon:'tab-ry-cur.png',inactiveIcon:'account'}	
				],
			};
		},
		created() {},
		methods: {
			changeTab(e) {
				console.log("changeTab",e)
				// let pathUrl = this.tabData[e].path
				// uni.$u.route({
				// 	url: pathUrl,
				// 	type:'reLaunch',
				// });
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.u-tabbar__content{
		box-shadow:$uni-box-shadow-base;
	}
	.tabitem{
		width: 40rpx;
		height: 40rpx;
		.tabImg{
			width: 40rpx;
			height: 40rpx;
		}
	}
	.tabMessage{
		width: 100rpx;
		height: 100rpx;
		border-radius: 100px;
		position: relative;
		top:-30rpx;
		background-color: #ffffff;
		display:flex;
		align-items: center;
		justify-content: center;
		box-shadow:$uni-box-shadow-base;
		.tabImg{
			width: 80rpx;
			height: 80rpx;
		}
	}

</style>
